<!DOCTYPE html>
<html>

<head>

	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">


	<title>用户管理</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<link href="${ctx}/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
	<link href="${ctx}/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
	<!-- Data Tables -->
	<link href="${ctx}/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
	<link href="${ctx}/css/animate.min.css" rel="stylesheet">
	<link href="${ctx}/css/style.min862f.css?v=4.1.0" rel="stylesheet">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
	<div class="row">
		<div class="col-sm-12">
			<div class="ibox float-e-margins">

				<div class="ibox-content">
					<div>
							<span>
								<button onclick="user_add()" class="btn btn-primary"><i
										class="glyphicon glyphicon-plus"></i>&nbsp;添加用户</button>
								<a href="javascript:location.reload();"  class="pull-right btn btn-default"><i
										class="glyphicon glyphicon-refresh"></i></a>

							</span>

					</div>
					<table class="table table-striped table-bordered table-hover dataTables-example text-center">
						<thead>
						<tr>
							<th class="text-center">用户名</th>
							<th class="text-center">手机</th>
							<th class="text-center">真实姓名</th>
							<th class="text-center">角色</th>
							<th class="text-center">加入时间</th>
							<th class="text-center">操作</th>
						</tr>
						</thead>
						<tbody>
                        <#list userList as user>
						<tr class="gradeU">
							<td>${user.userName}</td>
							<td>${user.telephone}</td>
							<td class="">${user.realName}</td>
							<td class="">${user.role.title}</td>
							<td class="">${user.createTime}</td>
							<td class="text-center">
								<a title="编辑"
								   style="text-decoration:none" onClick="user_update('${user.id}')"><i
										class="glyphicon glyphicon-pencil"></i> </a>&nbsp;&nbsp;
								<a title="删除" href="javascript:;"onClick="user_del(this,'${user.id}')"
								   style="text-decoration:none"><i class="glyphicon glyphicon-trash"></i> </a>
							</td>
						</tr>
                        </#list>
						</tbody>
					</table>

				</div>
			</div>
		</div>
	</div>

</div>

<script src="${ctx}/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctx}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctx}/js/plugins/dataTables/jquery.dataTables.min.js"></script>
<script src="${ctx}/js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="${ctx}/js/content.min.js?v=1.0.0"></script>
<script src="${ctx}/js/plugins/layer/layer.js"></script>
<script type="text/javascript">
	$('.dataTables-example').dataTable({
		"bStateSave": true, //状态保存
		"bLengthChange": false,
		"bFilter": false,
		"iDisplayLength": 7,
		"aoColumnDefs": [{"bSortable": false, "aTargets": [0, 5]}],
	});

	/*用户-增加*/
	function user_add() {
		layer.open({
			title: '添加用户',
			type: 2,
			area: ['800px', '500px'],
			shadeClose: true, //点击遮罩关闭
			content: '${ctx}/user/addUserPage'
		});
	}

	/*用户-修改*/
	function user_update(userId) {
		layer.open({
			title: '修改用户',
			type: 2,
			area: ['800px', '500px'],
			shadeClose: true, //点击遮罩关闭
			content: '${ctx}/user/updateUserPage?userId=' + userId
		});
	}

	/*管理员-停用*/
	function user_del(obj, id) {
		layer.confirm('确认要删除吗？', function (index) {
			$.post('${ctx}/user/deleteUser', {userId: id}, function (data) {
				var result = data.status;
				if (result == "1001") {
					layer.alert('删除成功!', {
						icon: 1,
						skin: 'layer-ext-moon'
					})
					$(obj).parents("tr").remove();
				} else if (result == "1002") {
					layer.alert('删除失败!', {
						icon: 2,
						skin: 'layer-ext-moon'
					})
				}
			}, "json");
		});
	}


</script>

</body>
</html>
